<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>赓续红色血脉，礼赞百年征程</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <img src="images/logo.png" alt="logo" class="logo">
        <h1>赓续红色血脉，礼赞百年征程</h1>
    </header>

    <nav>
        <a href="#about">关于作品</a>
        <a href="#history">红色历史</a>
        <a href="#gallery">图片展</a>
        <a href="#contact">联系我们</a>
    </nav>

    <section id="about">
        <h2>关于作品</h2>
        <div class="about-content">
            <p><strong>核心主题</strong>：本网页以“赓续红色血脉，礼赞百年征程”为核心主题，深度挖掘红色文化内涵，通过珍贵史料、英雄事迹与时代精神的融合，打造沉浸式红色教育平台，让用户在浏览中感悟初心使命，凝聚奋进力量。</p>
            
            <p><strong>技术架构</strong>：采用前后端分离模式，前端以 HTML5、CSS3、JavaScript 为基础，结合 Bootstrap 框架实现响应式布局，适配多终端访问；后端依托 Python Flask 框架搭建轻量服务，搭配 MySQL 数据库存储红色资源数据，通过 GitHub 与 Gitee 双平台部署保障访问稳定性。</p>
            
            <p><strong>核心功能</strong>：涵盖四大模块——<br>
            ✅ 红色知识库：整合党史资料、红色故事与经典影像；<br>
            ✅ 互动纪念馆：支持 360° 全景浏览革命遗址；<br>
            ✅ 虚拟打卡：记录用户学习轨迹；<br>
            ✅ 留言献礼：允许用户分享感悟、书写祝福。</p>
            
            <p><strong>设计亮点</strong>：突出红色主题表达与用户体验——<br>
            🎨 主色调采用中国红与金色搭配，象征革命热血与辉煌成就；<br>
            🌟 页面融入红旗、党徽等元素，辅以动态卷轴、粒子特效增强氛围感；<br>
            📱 采用分层设计与平滑过渡动画，提升浏览流畅度，同时优化无障碍访问功能，让红色精神触达更广泛人群。</p>
        </div>
    </section>

    <section id="history">
        <h2>红色历史回顾</h2>
        <ul>
            <li><strong>南昌起义（1927年）</strong>：打响了武装反抗国民党反动统治的第一枪。</li>
            <li><strong>长征（1934-1936年）</strong>：二万五千里长征诠释了坚定理想信念、不怕牺牲、团结互助的伟大革命精神。</li>
            <li><strong>抗战中的红色力量（1937-1945年）</strong>：八路军、新四军在全国抗战中发挥了中流砥柱作用。</li>
        </ul>
    </section>

    <section id="gallery">
        <h2>红色图片展</h2>
        <div class="gallery">
            <figure>
                <img src="images/longmarch.jpg" alt="长征途中的战士">
                <figcaption>长征途中的战士们，在艰难的征途中不屈前行。</figcaption>
            </figure>
            <figure>
                <img src="images/nanchang.jpg" alt="南昌起义纪念地">
                <figcaption>南昌起义纪念塔，见证了革命的伟大开端。</figcaption>
            </figure>
            <figure>
                <img src="images/banner.jpg" alt="党旗飘扬">
                <figcaption>鲜红的党旗在蓝天下飘扬，象征党的初心与使命。</figcaption>
            </figure>
        </div>
    </section>

    <footer id="contact">
        <p>联系邮箱：example@mail.com</p>
        <p>© 2024 我的红色主题网页</p>
    </footer>
</body>
</html>
